<template>
  <div class="page-wrap">
    <TableFilter :data="filter" v-model="query" ref="filter" @change="changeFilter"></TableFilter>
    <ScatterEcharts v-loading="loading" :topInfo="topInfo" :chartsData="charts" :topTitle="'重点病组优劣势分析'" />
  </div>
</template>

<script>
import ScatterEcharts from "@/components/ScatterEcharts/index.vue";
import dayjs from "@/utils/dayjs.min.js";
import { rptRzqkfx } from "@/api/report";
import TableFilter from "@/components/TableFilter";
import { dept2doc } from "@/api/patient";
import { UserModule } from "@/store/modules/user";
export default {
  components: {
    ScatterEcharts,
    TableFilter,
  },
  data() {
    return {
      deptList: [],
      loading: false,
      charts: [],
      topInfo: {},
      query: {
        lb: 3,
        timeType: 0,
        dept: "",
        size: 10,
        kssj: dayjs().subtract(1, "month").format("YYYY-MM-DD"),
        jssj: dayjs().format("YYYY-MM-DD"),
      },
    };
  },
  async created() {
    await this.getDepts();
    this.getTopInfo();
  },

  computed: {
    filter() {
      return {
        date: {
          props: {
            options: [{ label: "时间段", value: 0 }],
            isTwoRange: true,
            type: "daterange",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
          },
          keys: ["timeType", "kssj", "jssj"],
        },
        inline: [
          {
            props: {
              label: "病组数量",
              is: "el-select",
              options: [
                { label: "前10病组", value: 10 },
                { label: "前20病组", value: 20 },
                { label: "前30病组", value: 30 },
                { label: "前40病组", value: 40 },
                { label: "前50病组", value: 50 },
              ],
            },
            keys: "size",
          },
          {
            props: {
              label: "科室",
              is: "el-select",
              options: this.deptList,
            },
            keys: "dept",
          },
        ],
      };
    },
  },
  methods: {
    async getDepts() {
      let d = await dept2doc({ t: dayjs().format("YYYYMMDD") });

      d = d.data || [];

      let userdepts = await UserModule.GetUsername2depts();
      let deptts = Array.from(new Set(d.map((it) => it.科室)))
      if (userdepts.length > 0) {
        deptts = userdepts;
        this.query.dept = userdepts[0]
      }
      this.deptList = [...deptts.map((it) => ({ label: it, value: it }))];
    },
    async getTopInfo() {
      this.loading = true;
      try {
        const res = await rptRzqkfx({ ...this.query, lb: 1, dept: "" });
        this.topInfo = res.data[0];
        localStorage.setItem("staticInfo", res.data[0]);
        this.getEchartsDatas();
      } catch (error) {
        this.loading = false;
      }
    },
    async getEchartsDatas() {
      try {
        const res = await rptRzqkfx({ ...this.query });
        //占位元素
        const mockDatas = [
          [1, 10000, 0, "", 0],
          [-1, 10000, 0, "", 0],
          [-1, -10000, 0, "", 0],
          [1, -10000, 0, "", 0],
        ];
        this.charts = res.data
          .map((v) => {
            return [
              v.CMI,
              v.盈亏,
              /*  Math.abs(this.random()) */ Math.abs(v.人次 / 2),
              v.病组,
              v.人次,
            ];
          })
          .concat(mockDatas);
        this.loading = false;
      } catch (error) {
        this.loading = false;
      }
    },
    changeFilter(e) {
      let data = {
        ...e,
      };
      for (let key in data) {
        if (!data[key] && data[key] != 0) delete data[key];
      }
      this.query = data;

      this.getTopInfo();
    },
    random() {
      var r = Math.round(Math.random() * 100);
      return r * (r % 2 == 0 ? 1 : -1);
    },
    randomDataArray() {
      var d = [];
      var len = 100;
      while (len--) {
        d.push([random(), random(), Math.abs(random())]);
      }
      return d;
    },
  },
};
</script>

<style lang="scss" scoped>
.page-wrap {
  height: 100%;
  padding: 20px;
  height: 800px;
}
</style>
